<template>
	<view class="itu-demo">
		<view class="itu-demo-wrap">
			<view class="itu-demo-title">演示效果</view>
			<view class="itu-demo-area">
				<view class="itu-demo-result-line">
					<itu-jitter-dot ref="jitter" :textStyle="{color: 'red', fontSize: '24rpx'}" @timeout="timeout"></itu-jitter-dot>
				</view>
			</view>
		</view>
		<view class="itu-item-title itu-mt-20">状态切换</view>
		<subsection :list="list" v-model="current" @change="handleChange"></subsection>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
						name: '显示'
					},
					{
						name: '隐藏'
					}
				],
				fullscreenList: [{
						name: '否'
					},
					{
						name: '是'
					}
				],
				current: 0,
				fullscreenCurrent: 0,
				isShow: true,
				isFullscreen: false
			};
		},
		onLoad({ title }) {
			this.setNavigationBarTitle(title)
		},
		methods: {
			handleChange(val) {
				if (val === 0) {
					this.$refs.jitter.show()
				} else {
					this.$refs.jitter.hide()
				}
			},
			timeout(){
				console.log("timeout")
			}
		}
	}
</script>

<style lang="scss">
	.spin {
		position: relative;
	}
</style>